<!DOCTYPE html>

<html>
    <head>
        <title>#{get 'title' /}</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta charset="${_response_encoding}">
        <!-- Boostrap CSS -->
        <link rel="stylesheet" media="screen" href="@{'/public/bootstrap/css/bootstrap.min.css'}">
        <link rel="stylesheet" media="screen" href="@{'/public/bootstrap/css/bootstrap-responsive.min.css'}">
        <!-- Leaflet CSS -->
        <link rel="stylesheet" media="screen" href="@{'/public/leaflet/leaflet.css'}">
        <!--[if lte IE 8]>
     		<link rel="stylesheet" href="@{'/public/leaflet/leaflet.ie.css'}" />
 		<![endif]-->
 		<!-- Main CSS -->
 		<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/main.css'}">
        #{get 'moreStyles' /}
        <link rel="shortcut icon" type="image/png" href="@{'/public/images/favicon.png'}">
        <!-- JQuery JS -->
        <script src="@{'/public/javascripts/jquery-2.0.0.min.js'}" type="text/javascript" charset="${_response_encoding}"></script>
        <!-- Boostrap JS -->
        <script src="@{'/public/bootstrap/js/bootstrap.min.js'}" type="text/javascript" charset="${_response_encoding}"></script>
        <!-- Leaflet JS -->
        <script src="@{'/public/leaflet/leaflet.js'}" type="text/javascript" charset="${_response_encoding}"></script>
        #{get 'moreScripts' /}
        <!-- iOS capable -->
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <link rel="apple-touch-icon" href="@{'/public/images/ios/icon_57.png'}" />
		<link rel="apple-touch-icon" sizes="72x72" href="@{'/public/images/ios/icon_72.png'}" />
		<link rel="apple-touch-icon" sizes="114x114" href="@{'/public/images/ios/icon_114.png'}" />
		<link rel="apple-touch-icon" sizes="144x144" href="@{'/public/images/ios/icon_144.png'}" />
    </head>
   <body>
		<!-- Initialisation Facebook -->
		<div id="fb-root"></div>
		<script>
			window.fbAsyncInit = function() {
				// init the FB JS SDK
				FB.init({
					appId      : '488858384504080',                    // App ID from the app dashboard
					channelUrl : 'http://geoloc-upo.servebeer.com/channel.html', // Channel file for x-domain comms
					status     : true,                                 // Check Facebook Login status
					xfbml      : true                                  // Look for social plugins on the page
				});

			// Additional initialization code such as adding Event Listeners goes here
			};

			// Load the SDK asynchronously
			(function(d, s, id) {
				var js, fjs = d.getElementsByTagName(s)[0];
				if (d.getElementById(id)) return;
				js = d.createElement(s); js.id = id;
				js.src = "//connect.facebook.net/fr_FR/all.js";
				fjs.parentNode.insertBefore(js, fjs);
			}(document, 'script', 'facebook-jssdk'));
		</script>
		<!-- Menu -->
<!-- 		<div class="navbar navbar-inverse navbar-fixed-top hidden-phone"> -->
		<div class="navbar navbar-inverse navbar-fixed-top">
			<div class="navbar-inner">
				<div class="container">
					<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<a class="brand" href="/">Geoloc'UPO</a>
					<div class="nav-collapse collapse">
						<ul class="nav">
							<li><a href="/"><i class="icon-home icon-white"></i> Accueil</a></li>
							<li><a href="/admin"><i class="icon-user icon-white"></i> Admin</a></li>
							<li><a href="/webservices"><i class="icon-road icon-white"></i> Webservices</a></li>
							<li><a href="#" onclick="testGeoloc()"><i class="icon-map-marker icon-white"></i> Se localiser</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		#{doLayout /}
    </body>
</html>
